<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" >
<head>
    <th:block th:include="include :: header('Summernote富文本编辑器')" />
    <th:block th:include="include :: summernote-css" />
    <th:block th:include="include :: datetimepicker-css"/>
    <th:block th:include="include :: jasny-bootstrap-css" />


</head>
<body class="gray-bg">
<div class="wrapper wrapper-content">
    <div class="col-sm-12 search-collapse">
        <form id="form-property-add" enctype="multipart/form-data">
            <div class="select-list" style="display: flex;">
                <ul>
                    <li>
                        <input th:value="${details.id}" hidden name="id"/>
                    </li>
                    <li>
                        <input th:value="${details.createId}"   name="createId" hidden="hidden">
                    </li>
                    <li>
                        <input th:value="${details.userId}" name="userId" hidden="hidden"/>
                    </li>
                    <li>
                        <span>实验名称：</span>
                        <input th:value="${details.experimentName}" name="experimentName" readonly=”readonly”/>
                    </li>
                    <li>
                        <p>课程名称：</p>
                        <input th:value="${details.courseName}"  name="courseName" readonly=”readonly”/>
                    </li>
                    <li>
                        <p>实验类型：</p>
                        <input  name="experimentTypes" id="experimentTypes" th:value="${details.experimentTypes}" readonly=”readonly”/>
                        <!--<input th:if="${details.experimentType == 0}" th:value="虚拟仿真实验" name="type" disabled="disabled">
                        <input th:if="${details.experimentType == 1}" th:value="实物实验" name="type" disabled="disabled">-->
                       <!-- <select name="experimenttype">
                            <option th:selected="${details.experimentType}=='0'" value="虚拟仿真实验">虚拟仿真实验</option>
                            <option th:selected="${details.experimentType}=='1'" value="实物实验">实物实验</option>
                        </select>-->
                    </li>
                    <li>
                        <span>预约的实验室：</span>
                        <input type="text" th:value="${details.experimentMessage}" name="experimentMessage" readonly=”readonly”/>
                    </li>
                   <!--<li style="position:relative;right:-10%;top:10%">
                        <a class="btn btn-primary btn-rounded btn-sm" onclick="pass()" ><i class="fa fa-search"></i>&nbsp;下载附件</a>
                    </li>-->
                    <li>
                        <a class="btn btn-primary btn-rounded btn-sm" onclick="submitHandler()"><i class="fa fa-search"></i>&nbsp;保存</a>
                        <a class="btn btn-warning btn-rounded btn-sm" onclick="$.modal.reload()"><i class="fa fa-refresh"></i>&nbsp;取消</a>
                        <a class="btn btn-primary btn-rounded btn-sm" onclick="pass()" ><i class="fa fa-search"></i>&nbsp;下载附件</a>
                    </li>
                </ul>
            </div>
            <div class="row">
                <div class="col-sm-12">
                    <div class="ibox float-e-margins">
                        <div class="ibox-title">
                            <h5 style="position:relative;left:50%;">实验介绍</h5>
                            <input th:value="${details.introduce}" type="hidden" id="experimentIntroduce" name="introduce">
                            <input th:value="${details.filePath}" hidden id="path" name="filePath">
                        </div>
                        <div class="ibox-content no-padding">
                            <div class="summernote1">
                            </div>
                        </div>
                    </div>
                </div>
            </div>
           <!-- <div class="row">
                <input type="text" th:value="${details.experimentResult}" th:name="experimentResult" id="experimentResult" style="width: 1000px" hidden/>
                <div class="col-sm-12">
                    <div class="ibox float-e-margins">
                        <div class="ibox-title" hidden="true" id="titleName">
                            <h5 style="position:relative;left:50%;">在线实验成绩</h5>
                        </div>
                        <div class="ibox-content no-padding">
                            <div id="experimentResult2" class="text-center">

                            </div>
                        </div>
                    </div>
                </div>
                &lt;!&ndash;<span id="experimentResult2" class="text-center">
                    <h3 hidden="true" id="titleName">在线实验成绩</h3>
                </span>&ndash;&gt;
            </div>-->
            <div class="row">
                <div class="col-sm-12">
                    <div class="ibox float-e-margins">
                        <div class="ibox-title">
                            <h5 style="position:relative;left:50%;">实验报告</h5>
                            <input type="hidden" name="experimentShape" id="experimentShape" th:value="${details.experimentShape}">
                        </div>
                        <div class="ibox-content no-padding">
                            <div class="summernote2">

                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="row">
               <div class="col-sm-12">
                     <div class="ibox float-e-margins">
                        <div class="ibox-title" style="display: flex">
                            <h5 style="position:relative;left:50%;">教师批改</h5>
                            <p style="position:relative;left:84%;">得分：</p>
                            <input type="text" name="score" style="position:relative;left:84%;" id="score"/>
                        </div>

                        <div class="ibox-content no-padding">
                            <div class="summernote3">
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!--<div>
                <div class="ibox-title">
                    <h5 style="position:relative;left:50%;">上传附件</h5>
                </div>
                <div class="fileinput fileinput-new input-group" data-provides="fileinput">
                    <div class="form-control" data-trigger="fileinput"><i class="glyphicon glyphicon-file fileinput-exists"></i> <span class="fileinput-filename"></span></div>
                    <span class="input-group-addon btn btn-white btn-file"><span class="fileinput-new">选择文件</span><span class="fileinput-exists">更改</span><input  name="filePath" type="file" id="filePath"></span>
                    <a href="#" class="input-group-addon btn btn-white fileinput-exists" data-dismiss="fileinput">清除</a>
                </div>
            </div>-->
        </form>
    </div>
</div>
<th:block th:include="include :: footer" />
<th:block th:include="include :: summernote-js" />
<th:block th:include="include :: datetimepicker-js" />
<th:block th:include="include :: jasny-bootstrap-js" />
<script>


    window.onload=function(){
        var one = $("#experimentIntroduce").val();
        var two = $("#experimentShape").val();
        $('.summernote1').summernote('code', one);
        $('.summernote2').summernote('code', two);
    }


    var prefix = ctx + "buildexperiment";
    $(document).ready(function () {
        $('.summernote').summernote({
            lang: 'zh-CN'
        });
    });
    var edit = function () {
        $("#eg").addClass("no-padding");
        $('.click2edit').summernote({
            lang: 'zh-CN',
            focus: true
        });
    };
    var save = function () {
        $("#eg").removeClass("no-padding");
        var aHTML = $('.click2edit').summernote('code');
        $('.click2edit').summernote('destroy');
    };

    function pass(){
        var path=$("#path").val();
        console.log(path);
        $.modal.confirm("确认要下载吗?", function() {
            if(path==null || path==""){
                var result={"code":"500","msg":"没有附件"}
                //alert(result.msg)
                $.operate.successCallback(result);
            }else {
                window.location.href = ctx + "common/download/resource/?resource=" + path;
            }
        });
    }

    $('#datetimepicker-demo-1').datetimepicker({
        format: "yyyy-mm-dd",
        minView: "month",
        autoclose: true
    });
    $('#datetimepicker-demo-2').datetimepicker({
        format: "yyyy-mm-dd",
        minView: "month",
        autoclose: true
    });
    $('.summernote1').summernote({
        placeholder: '请输入实验介绍',
        height : 192,
        lang : 'zh-CN',
        followingToolbar: false,
        callbacks: {
            onImageUpload: function(files, editor, $editable) {
                var formData = new FormData();
                formData.append("file", files[0]);
                $.ajax({
                    type: "POST",
                    url: ctx + "common/upload",
                    data: formData,
                    cache: false,
                    contentType: false,
                    processData: false,
                    dataType: 'json',
                    success: function(result) {
                        if (result.code == web_status.SUCCESS) {
                            //alert(result.url+","+result.fileName)
                            $('.summernote1').summernote('editor.insertImage', result.url, result.fileName);
                        } else {
                            $.modal.alertError(result.msg);
                        }
                    },
                    error: function(error) {
                        $.modal.alertWarning("图片上传失败。");
                    }
                });
            }
        }
    });
    $('.summernote2').summernote({
        placeholder: '请输入实验报格式',
        height : 500,
        lang : 'zh-CN',
        followingToolbar: false,
        callbacks: {
            onImageUpload: function(files, editor, $editable) {
                var formData = new FormData();
                formData.append("file", files[0]);
                $.ajax({
                    type: "POST",
                    url: ctx + "common/upload",
                    data: formData,
                    cache: false,
                    contentType: false,
                    processData: false,
                    dataType: 'json',
                    success: function(result) {
                        if (result.code == web_status.SUCCESS) {
                            //alert(result.url+","+result.fileName)
                            $('.summernot2').summernote('editor.insertImage', result.url, result.fileName);
                        } else {
                            $.modal.alertError(result.msg);
                        }
                    },
                    error: function(error) {
                        $.modal.alertWarning("图片上传失败。");
                    }
                });
            }
        }
    });

    var prefix = ctx + "website/myexment"
    function submitHandler() {
        var score=$('#score').val();
        if(score==null || score==0){
            $.modal.alertError("请输入分数：")
        }else{
            if ($.validate.form()) {
                var a=$(".summernote2").summernote('code');
                $("#experimentShape").val(a);
                $.operate.save(prefix + "/add2", $('#form-property-add').serialize());
            }
        }
    }

    /*$(function(){
        var a=$("#experimentResult").val();
        console.log(a)
        var array=new Array();
        if(a==" " || a==null){
            $("#titleName").attr("hidden",true);
        }else{
            array=a.split("/");
            $("#titleName").attr("hidden",false);
        }
        console.log(array)
        for(var item of array){
            console.log(item)
            $("#experimentResult2").append("<h5>"+item+"</h5>");
        }
    })*/
</script>
</body>
</html>